<template>
    <div class="approve_detail">
        <!-- <Header v-if="showHeader" :title="title"></Header> -->
				<Header v-if="showHeader" title="详情页"></Header>
				 <!-- v-if="pageTitle=='我审批的'" -->
        <div class="approve_opinion">
            <p>审批意见</p>
            <van-cell-group>
                <van-field 
                type="textarea" 
                rows="5"
                autosize 
                v-model="approveOpinion" 
                maxlength="200"
                show-word-limit
                placeholder="审批意见不能超过200字" />
            </van-cell-group>
        </div>
       <!-- <h2 v-else class="postponed_status">{{status_desc}}</h2> -->
				<div class="user_info">
					<div class="user_info_base">
					    <img v-if="baseInfo.fd_sta_photo" class="user_pic" :src="baseInfo.fd_sta_photo" alt="个人头像">
					    <img v-else class="user_pic" :src="pic" alt="头像" />
					    <ul>
					        <li class="one-txt-cut uesr_name">{{baseInfo.fd_sta_name}}</li>
					        <!-- <li class="one-txt-cut">电话：{{userInfo.fd_sta_mobile}}<a><img :src="telIcon" alt="手机号" @click="callPhone(userInfo.fd_sta_mobile)"></a></li> -->
					        <li class="one-txt-cut"><span>电话：{{baseInfo.fd_sta_mobile}}</span><a :href="'tel:'+ baseInfo.fd_sta_mobile"><img :src="telIcon" alt="手机号" @click="callPhone(baseInfo.fd_sta_mobile)"></a></li>
									<!-- <li class="one-txt-cut">职位：{{baseInfo.fd_jobs_name}}</li> -->
									<li class="organic_name"><span>所属组织：</span><b>{{baseInfo.organic_name}}</b></li>
					    </ul>
					</div>
				</div>
        <UserInfo :userInfo="userInfoObj"></UserInfo>
				
				<div class="cost_info">
					<p class="info_title">费用项目</p>
					<ul class="cost_info_list">
							<li v-for="(item, index) in userInfo.item_list" :key="index">
								<p>
									<span class="item_title">费用项目 </span><span>{{item.item_name}}</span>
								</p>
								<p>
									<span class="item_title">金额 </span><span>{{item.fd_ptltdl_cost}}</span>
								</p>
								<p>
									<span class="item_title">备注 </span><span class="item_des">{{item.fd_ptltdl_memo}}</span>
								</p>
							</li>
					</ul>
				</div>
				
				<div class="upload_document">
					<p class="info_title">上传单据</p>
				</div>
				<div class="upload_document_info">
					<van-uploader v-model="fileList" multiple></van-uploader>
					<!-- upload_document_nums>0判断P的显示隐藏 -->
					<p class="upload_document_nums" v-if="upload_document_nums>0">+{{upload_document_nums}}</p>
				</div>
				
				<div class="base_list">
					<p class="info_title">
						<span>冲抵借款</span>
						<!-- <span class="color_33ab9f" @click="readMatch">查看冲抵</span> -->
						<van-button v-if="userInfo.fd_offset_money >0" class="color_33ab9f" type="primary" size="mini" @click="readMatch">查看冲抵</van-button>
					</p>
					<ul class="base_info_list">
					    <li><span class="item_title">冲抵金额 </span><span>{{userInfo.fd_offset_money}}</span></li>
					</ul>
				</div>
				
				<van-action-sheet v-model="showSelectMatch" class="add_approver add_approver_detail bottom_btn_line">
					<div class="content" >
						<div class="borrow_money">
							<div class="m-t-30">
								<van-checkbox-group>
								  <van-cell-group>
								    <van-cell
								      v-for="(item, index) in baoxiaoList"
								      :key="index+1"
								    > 
											<p><span>单据编号:</span> {{item.fd_rnmy_listno}}</p>
											<p><span>借款人:</span> {{item.fd_rnmy_loanman}}</p>
											<p><span>借款金额:</span> {{item.borrow_money}}</p>
											<p><span>冲抵金额:</span> {{item.fd_rnmy_money}}</p>
											<p><span>借款类型:</span> {{item.borrow_type}}</p>
											<p><span>单据日期:</span> {{item.fd_rnmy_listdate}}</p>
								    </van-cell>
								  </van-cell-group>
								</van-checkbox-group>
							</div>
							<van-tabbar :z-index="1000">
							    <van-tabbar-item>
											<van-button size="large" @click="matchGoback">返回</van-button>
							    </van-tabbar-item>
							</van-tabbar>
						</div>
					</div>
				</van-action-sheet>
				
				<div class="base_list">
					<p class="info_title">收款人资料</p>
					<ul class="base_info_list">
					    <li><span class="item_title">收款人 </span><span>{{userInfo.fd_payee}}</span></li>
					    <li><span class="item_title">收款人手机号 </span><span>{{userInfo.fd_payee_phone}}</span></li>
					    <li><span class="item_title">银行名称 </span><span>{{userInfo.fd_bank_car}}</span> </li>
					    <li><span class="item_title">银行卡号 </span><span>{{userInfo.fd_bank_car_number}}</span></li>
					</ul>
				</div>
				
				<div class="rxlc-step">
					<h5>
						<span>审批流程</span>
						<span calss="pack_up" v-if="approve_logs.length>0 && wait_approval_list.length>0" style="color: #34ab9f !important;" @click="packUpBtn">{{packUpText}}</span>
					</h5>
				  <div class="rxlc-content" v-if="showContent">
						<!-- 审批日志 start -->
				    <div class="content-list" v-for="(item, index) in approve_logs" >
				      <div class="content-list-lt">
								<div v-if="item.is_approve == 0" class="lt-icon-box lt-icon-box-no-pass"></div>
								<div v-if="item.is_approve == 1" class="lt-icon-box lt-icon-box-pass"></div>
				        <div class="white-line"></div>
				      </div>
				      <div class="content-list-rt">
				        <div class="list-rt-content">
									<h3>
										<span>{{item.check_name}}</span>
									</h3>
									<div class="gray_box">
										<p class="date">
											<span>{{item.user_name}}</span>
											<span>{{item.create_time}}</span>
										</p>
										<p class="info">{{item.remark}}</p>
									</div>
								</div>
				      </div>
				    </div>
						<!-- 审批节点 start -->
						<div class="content-list" v-for="(item, index) in wait_approval_list" >
						  <div class="content-list-lt">
								<div class="lt-icon-box"></div>
						    <div class="white-line"></div>
						  </div>
						  <div class="content-list-rt">
						    <div class="list-rt-content">
									<h3>
										<span>{{item.node}}</span>
									</h3>
									<div class="write_box">
										<p class="date">
											<span>{{item.user|ObjString}}</span>
										</p>
									</div>
								</div>
						  </div>
						</div>
				  </div>
				</div>
				
				 <!-- v-if="pageTitle=='我审批的'" -->
        <div class="fixed_two_btn">
					<van-tabbar :z-index="1000">
					    <van-tabbar-item>
					        <!-- <van-button size="normal" :disabled="approveOpinion.length<=0|| !approveOpinion" @click="submitApprove(1)">审批通过</van-button>
					        <van-button size="normal" :disabled="approveOpinion.length<=0|| !approveOpinion" @click="submitApprove(-1)">审批不通过</van-button> -->
									<van-button size="normal" @click="submitApprove(1)">审批通过</van-button>
									<van-button size="normal" @click="submitApprove(-1)">审批不通过</van-button>
					    </van-tabbar-item>
					</van-tabbar>
				</div>
        <Loading v-show = "showLoading"></Loading>
    </div>
</template>
<script>
import { applyDetail,approveDetail,expenseDetail,approvalExpense,baoxiaoList } from "@/request/api.js";
import UserInfo  from "@/components/business/finUserInfo.vue";
import ReferData from "@/components/business/ReferData.vue";
import ApprovalStep from "@/components/business/ApprovalStep.vue";
import Header from "@/components/Header.vue";
import Loading from "@/components/Loading.vue";
import deboune from '@/utils/deboune.js';
import { profile } from "@/request/api.js";
export default {
    name:'ApproveDetail',
    data(){
        return {
            showHeader:this.$store.state.showHeader,
            title:'',
            showLoading:true,
            status_desc:'',
						userInfoObj:{},
						fromPage:false,
						telIcon:require('@/assets/images/tel_icon.png'),
						pic:require('@/assets/images/morentouxiang.png'),
						baseInfo:{},
            userInfo:{
                fd_sta_name:'',
                fd_jobs_name:'',
                fd_sta_mobile:'',
                fd_sta_photo:'',
                apply_reason:'',
                start_time:'',
                end_time:'',
                history_apply_time:'',
                now_check_time_status:'',
                total_time:'',
                created_at:'',
                apply_img:[],
								fd_payoutlist_picurl:[],
								fd_payoutlist_state:0,
            },
						// applicantInfo:{},
						// applicantInfoId:'',
            ReferDataList:{
                rel_reg_num:'',
                open_app_num:'',
                tm_article_share_num:'',
                five_day_money:'',
                history_total_money:'',
                next_level_user_num:''
            },
            approveOpinion:'',
            pageName:'',
						pageTitle:'',
						payoutlistId:'',
            stepList:[],
            activeStep:0,
            apply_image:[require('@/assets/images/static_images.png')],
						//审批流
						addBtnShow: true,
						rxlc_content: [],
						approve_logs: [],
						wait_approval_list: [],
						showContent:true, //审批流程默认收起
						packUpText:'收起', 
						showSelectMatch:false,
						baoxiaoList:[],
						fileList:[],
						upload_document_nums:0,
        }
    },
    components:{
        UserInfo,
        ReferData,
        ApprovalStep,
        Loading,
        Header
    },
		filters: {
				ObjString(obj) {
					obj = Object.values(obj).join("，")
						return obj;
				}
		},
		beforeRouteEnter (to, from, next) {
		    next(vm => {
					// console.log(to,'to');
					// console.log(from,'from');
					localStorage.setItem('fromUrlObject',JSON.stringify(from));
		    });
		  },
    mounted(){
			let status = this.$route.query.the_approve_status;
        // console.log(localStorage.getItem('pageName'));
        this.pageTitle = localStorage.getItem('pageTitle');
        let id = this.$route.query.id;
				let that= this;
				expenseDetail({token:this.$store.state.token,id:id}).then(res=>{
					this.showLoading = false;
					if(res.code == 1){
						this.$toast({
						    duration: 1000,
						    message:res.msg
						});
						return false;
					}
            let data = res.data;
						if(data == null && typeof data == 'undefined'){// 从消息列表进来
							this.$dialog.alert({
								title: '提示',
								message: '单据不存在或已删除'
							}).then(() => {
								// 跳转 【费用--我发起的】列表页
								this.$router.push('/finSponsored');
							});
							return false;
						}
						if(status != undefined && status != data.fd_payoutlist_state){// 从消息列表进来
							this.$dialog.alert({
								title: '提示',
								message: '单据状态已修改'
							}).then(() => {
								// 跳转 【费用--我发起的】列表页
								this.$router.push('/finSponsored');
							});
							return false;
						}
						if( data.fd_payoutlist_state == 8 || data.fd_payoutlist_state == 11 ){
							this.$dialog.alert({
								title: '提示',
								message: '移动端暂时不支持，会计、出纳审批！<br />请登录ERP后台操作审批；'
							}).then(() => {
								this.goBack();
							});
						}
						
						data.fd_payoutlist_picurl.forEach(item=>{
							that.fileList.push({url:item})
						}) ; //上传图片预览
						that.uploadFileNum();
						that.payoutlistId = res.data.fd_payoutlist_id
						that.status_desc = data.approve_status_text;
						that.userInfo = data;
						that.userInfoObj = data;
						that.getprofile(data.fd_payoutlist_dealwithman_id);
						that.userInfo.item_list.forEach(item=>{
							item.fd_ptltdl_cost = parseFloat(item.fd_ptltdl_cost).toFixed(2);
						});
						that.userInfo.fd_payoutlist_allmoney = parseFloat(that.userInfo.fd_payoutlist_allmoney).toFixed(2);
						that.approve_logs = data.approve_logs;
						that.wait_approval_list = data.wait_approval_list;
        }).catch(error=>{
            console.log(error)
            this.showLoading = false;
        })
    },
    methods:{
				goBack(){
					// console.log('执行 $router.push start');
					let fromUrlObject = localStorage.getItem('fromUrlObject');
					if(fromUrlObject != null && fromUrlObject != undefined ) fromUrlObject = JSON.parse(fromUrlObject);
					if( fromUrlObject != null && fromUrlObject != undefined && fromUrlObject.name != null ){
						this.$router.push({path:fromUrlObject.path,query:fromUrlObject.query});
					}else{
						this.$router.push('/finAccraditation');
					}
					localStorage.removeItem('fromUrlObject');
					// console.log('执行 $router.push end');
				},
			  getprofile(id){
					// 获取员工的基本资料
					profile({token:this.$store.state.token,fd_sta_id:id}).then(res=>{
					    let list = res;
					    this.baseInfo = list.data.staffer;
							//localStorage.setItem('user_profile',this.baseInfo);
					}).catch(error=>{
					    console.log(error)
					});
				},
				//调用原生的电话
				callPhone(phone){
						console.log(phone)
						this.$bridge.callhandler('takePhone', phone, responseCallback => {
								// 处理返回数据
								console.log('JS Echo called with:', phone);
								// responseCallback(phone);
								return false;
						})
				},
			  //上传单据
				uploadFileNum(file) {// 获取后台传来的照片数量
					// 因为前面有4张，所以剩余数量-1
					this.upload_document_nums = this.fileList.length-4;
				},
				//查看冲抵
				readMatch(){
					this.showSelectMatch = true;
					let id = this.$route.query.id;
					baoxiaoList({token:this.$store.state.token,type:2,baoxiao_id:id}).then(res=>{
							// 请求的列表数据
							let data = res.data
							this.baoxiaoList = data.allList
					}).catch((e) => {
							console.log(error)
							this.showLoading = false;
					})
				},
				matchGoback(){
					this.showSelectMatch = false;
				},
				//收起
				packUpBtn(){
					this.showContent = !this.showContent;
					if(this.showContent==true){  
							this.packUpText = "收起"  
					}else if(this.showContent==false){  
							this.packUpText = "展开"  
					} 
				},
        //获取相对路径
        GetUrlRelativePath(url){
            let arrUrl = url.split("//");
            let start = arrUrl[1].indexOf("/");
            let relUrl = arrUrl[1].substring(start);//stop省略，截取从start开始到结尾的所有字符
    　　　　if(relUrl.indexOf("?") != -1){
    　　　　　　relUrl = relUrl.split("?")[0];
    　　　　}
    　　　　return relUrl;
    　　},
				submitApprove:deboune._debounce_merge(function(type) {
					if(this.approveOpinion.length<=0|| !this.approveOpinion){
						this.$toast({
								duration: 2000,
								message:'请填写审批意见！',
						 });
						return false;
					}
					let operator_name = localStorage.getItem('staffer_name');
            let msg = type == 1 ? '是否确认审批通过？' : '是否确认审批不通过？';
						this.$dialog.confirm({
						  title: '提示',
						  message: msg
						}).then(() => {
							this.showLoading = true;
							approvalExpense({token:this.$store.state.token,id:this.payoutlistId,submit_status:type,approve_status:this.userInfo.fd_payoutlist_state,approve_remark:this.approveOpinion}).then(res=>{
							    this.showLoading = false;
							    if (res.code!=0) {
							        this.$toast(res.msg);
											return false;
							    }
									// 跳转
									this.goBack();
									
							}).catch(error=>{
							    console.log(error)
							    this.showLoading = false;
							})
							
						}).catch(error=>{
						    console.log(error)
						});
        },1000),
    },
}
</script>
<style lang="less" scoped>
.approve_detail{
    width: 100%;
    height: auto;
		padding-bottom: 55px;
    box-sizing: border-box;
		.user_info{
		    width: 100%;
		    height: auto;
		    padding: 10px 15px;
		    box-sizing: border-box;
		    background: #fff;
		    margin: 5px auto 0;
				.user_info_base{
						width: 100%;
						height: auto;
						display: flex;
						justify-content: flex-start;
						align-items: center;
						overflow: hidden;
						// border-bottom: 1px solid #f5f5f5;
						img{
								display: block;
								width: 70px;
								height: 70px;
						}
						.user_pic{border-radius: 50%;}
						ul{
								height: auto;
								padding-left: 20px;
								box-sizing: border-box;
								overflow: hidden;
								flex: 3;
								li{
										width: 100%;
										height: 25px;
										font-size: 14px;
										color: #151617;
										a{
												// float: right;
												display: inline-block;
												margin-left: 10px;
												img{width: 15px;height: 15px;}
										}
								}
								li.organic_name {
									span {
										width: 70px;
										height: 30px;
										float: left;
									}
									b{
										float: left;
										width: calc(100% - 75px);
										min-height: 30px;
										font-weight: 500;
									}
								}
								.uesr_name{font-size: 15px;font-weight: bold;}
						}
				}
		}
    .approve_opinion{
        width: 100%;
        height: auto;
        background: #fff;
        margin-bottom: 10px;
        padding: 10px 15px;
        box-sizing: border-box;
        color: #151617;
        font-size: 14px;
        p{
            line-height: 36px;
            font-weight: bold;
        }
        .van-hairline--top-bottom::after, .van-hairline-unset--top-bottom::after{border: none;}
        .van-cell{padding: 0;font-size: 14px;color: #999;}
    }
    .postponed_status{
        width: 100%;
        height: 50px;
        line-height: 50px;
        font-size: 15px;
        color: #fff;
        font-weight: bold;
        background: #02ccbd;
        padding: 0 15px;
        box-sizing: border-box;
        margin-bottom: 10px;
    }
    /deep/ .van-button--normal{
        font-size: 16px;
        font-weight: bold;
        background-color: #02ccbd;
        color: #fff;
        margin: 0 20px;
    }
		.fixed_two_btn {
			/deep/ .van-tabbar-item__text {
				width: 100%;
			}
			/deep/ .van-button--normal{
				width: 50%;
				margin: 0;
			}
			/deep/ .van-button--normal:last-child{
				background-color: #ff9966;
			}
		}
		.upload_document,.base_list{
			width: 100%;
			height: auto;
			padding: 10px 15px;
			box-sizing: border-box;
			background: #fff;
			margin-top: 10px;
		}
		.uploadParent {
			background-color: #fff;
			padding: 10px 15px;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;
			ul{
				width: 100%;
				li {
					width:25%;
					height:100%;
					padding:0 5px;
					box-sizing: border-box;
					display: inline-block;
					img{
						width: 100%;
						height: 100%;
					}
				}
			}
		}
		.info_title {
			padding: 10px 0;
			color: #151617;
			font-size: 14px;
			font-weight: bold;
			display: flex;
			justify-content: space-between;
			button {
				font-weight: 500;
				padding: 0 3px;
			}
		}
		.base_list {
			ul {
				width: 100%;
				height: auto;
				box-sizing: border-box;
				font-size: 13px;
				li{
					width: 100%;
					display: flex;
					align-items: center;
					padding: 5px 0;
					box-sizing: border-box;
					span {margin-left: 30px;}
					.item_title{
							margin-left: 0;
							text-align: right;
							color: #999;
							width: 90px;
							font-size: 13px;
					}
				}
			}
		}
		.color_33ab9f {
			background-color: #33ab9f;
		}
		.rxlc-step {
		    width: 100%;
				background-color: #fff;
				margin-top: 10px;
				h5 {
					background: #fff;
					margin-top: 10px;
					padding: 12px 15px 6px;
					box-sizing: border-box;
					color: #151617;
					font-size: 14px;
					display: flex;
					justify-content: space-between;
				}
		    .rxlc-content {
		      width: 100%;
		      position: relative;
					bottom: 10px;
		      .content-list {
		        width: 100%;
		        display: table;
		        .content-list-lt {
		          display: table-cell;
							padding-left: 15px;
		          position: relative;
							top: 2px;
		          color: #ffffff;
		          font-size: 16px;
							.lt-icon-box {
								width: 13px;
								height: 13px;
								background:url(../../../assets/images/icon_splc_04.png);
								background-size:13px 13px;
								background-repeat:no-repeat;
							  margin-right: 7px;
							  z-index: 999;
							}
							.lt-icon-box-pass {
								background-image:url(../../../assets/images/icon_splc_01.png);
							}
							.lt-icon-box-no-pass {
								background-image:url(../../../assets/images/icon_splc_03.png);
							}
		          .white-line {
		            width: 1px;
		            height: 100%;
		            position: absolute;
		            top: 24px;
								left: 21px;
		            background: #e4e4e4;
		          }
		        }
		        .content-list-rt {
		          width: 93%;
		          display: table-cell;
							padding-right: 15px;
		          .list-rt-content {
								padding: 12px 0 0;
		            color: #333333;
		            font-size: 13px;
		            line-height: 18px;
								h3 {
									color: #333333 !important;
									font-weight: 500;
									font-size: 14px;
									margin-bottom: 2px;
									display: flex;
									justify-content: space-between;
									/deep/ .van-icon-add-o {
										color: #21a399;
										font-size: 18px;
										// font-weight: 600;
									}
									// .addButton {
									// 	width: 20px;
									// 	height: 20px;
									// 	display: inline-block;
									// 	background-color: pink;
									// }
								}
								.name_box {
									color:#343434;
									padding-left: 10px;
									margin-top: 5px;
								}
								.gray_box {
									background-color: #f2f2f2;
									padding: 8px;
									.date {
										display: flex;
										justify-content: space-between;
										margin-bottom: 5px;
										color: #333333 !important;
									}
									.info {
										color: #676767 !important;
										word-break: break-all;
									}
								}
								.write_box {
									background-color: #fff;
									padding:2px 8px;
								}
		          }
		        }
		        &:last-child {
		          .content-list-lt {
		            .white-line {
		              width: 0px;
		            }
		          }
		          .content-list-rt {
		            .cat-line {
		              margin-left: 10px;
		              margin-top: 20px;
		              border-bottom: none;
		            }
		          }
		        }
		      }
		    }
		  }
			.cost_info {
				width: 100%;
				height: auto;
				padding: 10px 15px;
				box-sizing: border-box;
				background: #fff;
				margin-top: 10px;
				.cost_info_list {
					li {
						border-bottom: 1px solid #f2f2f2;
						margin: 5px 0;
						p{
							width: 100%;
							display: flex;
							align-items: center;
							padding: 5px 0;
							box-sizing: border-box;
							span {margin-left: 30px;}
							.item_title{
									margin-left: 0;
									text-align: right;
									color: #999;
									width: 90px;
									font-size: 13px;
							}
							.item_des {
								width: 66%;
							}
						}
					}
					li:last-child{
						border:none;
					}
				} 
			}
}
		/deep/ .van-dialog /deep/ .van-dialog__footer--buttons{
			/deep/ .van-button {
				width: 60px !important;
				border-color:aqua !important;
			}
		}
		
	/deep/ .add_approver {
		height: 100% !important;
		max-height: 100% !important;
		border-radius: 0 !important;

		.van-action-sheet__header {
			.van-action-sheet__close {
				display: none;
			}
		}
		
		.content {
			padding: 15px;
		}
		
		.borrow_money {
			.bold {
				font-weight: 600;
			}
			p span{
				margin-right: 5px;
			}
			/deep/ .van-checkbox__icon--checked .van-icon {
				background-color: #02ccbd;
				border-color: #02ccbd;
			}
			/deep/ .van-tabbar-item__text{
			    display: block;
			    width: 100%;
			}
			/deep/ .van-button--large{
					width: 100%;
			    font-size: 16px;
			    font-weight: bold;
			    background-color: #02ccbd;
			    color: #fff;
			}
			.selectStyle {
				padding-bottom: 50px;
			}
			.m-t-30 {
				margin-bottom: 30px;
			}
		}
				
	}
	
	.add_approver_detail {
		.content {
			padding-top: 0;
		}
	}
	
	.upload_document_info {
		position: relative;
		padding-left: 15px;
		padding-bottom: 10px;
		box-sizing: border-box;
		background: #fff;
	}	
	
	.upload_document_nums{
		    position: absolute;
		    left: 279px;
		    top: 0px;
		    color: #fff;
		    font-size: 31px;
		    background: #000;
		    width: 80px;
		    height: 80px;
		    opacity: 0.3;
		    text-align: center;
		    line-height: 80px;
				border-radius: 10px;
	}
	.upload_document_nums:hover{
		display: none;
	}
	/deep/ .van-uploader__upload{
		display: none !important;
	}
	/deep/ .van-uploader__preview{
		display: none !important;
	} 
	/deep/ .van-uploader__preview:nth-child(1),
	/deep/ .van-uploader__preview:nth-child(2),
	/deep/ .van-uploader__preview:nth-child(3),
	/deep/ .van-uploader__preview:nth-child(4)
	{
		.van-uploader__preview-delete {
			display: none !important;
		}
		display: block !important;
	}	
	
	.bottom_btn_line {
		.borrow_money {
			.van-tabbar--fixed {
				.van-tabbar-item {
					width: 100%;
					height: 50px;
					background-color: #02ccbd;
					color: #fff;
				}
				.van-button--large {
					width: 100%;
					height: 50px;
					font-size: 16px;
					font-weight: bold;
					background-color: #02ccbd;
					color: #fff;
					border: none !important;
					.van-button__text {
						width: 100%;
						height: 50px;
						border: none;
						display: block;
						background-color: #02ccbd;
						color: #fff;
					}
				}
			}
		}
	}
</style>